﻿@{
    Layout = null;
}

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="renderer" content="webkit">
    <meta name="keywords" content="" />
    <meta name="description" content="" />
    <title>首页</title>
    <link href="~/Content/PC/css/public.css" rel="stylesheet" />
    <link href="~/Content/PC/css/style.css" rel="stylesheet" />
    <link href="~/Content/PC/css/swiper.min.css" rel="stylesheet" />
    <link href="~/Content/PC/layui/css/layui.css" rel="stylesheet" />
    <script src="~/Scripts/jquery-1.10.2.js"></script>
    <script src="~/Content/PC/layui/layui.js"></script>
    @*<script src="~/Scripts/layui/lay/modules/laytpl.js"></script>*@
    
    <script src="~/Content/PC/layui/layui.js"></script>
    <script src="~/Content/PC/js/swiper.min.js"></script>
    <script>
        //首页焦点图设置
        
        layui.use(['element', 'laytpl'], function () {
            var $ = layui.jquery
            , element = layui.element(),//Tab的切换功能，切换事件监听等，需要依赖element模块
            laytpl = layui.laytpl;

            $.post('/Home/HomeBind', function (data) {
                if (data.success) {
                    $('#ProductTypeList').html('');
                    var getTpl = $('#HomeType').html();
                    $.each(data.data.newProductTypeList, function (i, r) {
                        r.Index = i + 1;
                        laytpl(getTpl).render(r, function (html) {
                            $('#ProductTypeList').append(html);
                        });
                    })
                    var getTpl1 = $('#crossType').html();
                    $('.crossProductType').append("<li><a href='/Home/index'>首页</a></li>")
                    $.each(data.data.newProductTypeList, function (i, r) {
                        r.Index = i + 1;
                       
                        laytpl(getTpl1).render(r, function (html) {
                            $('.crossProductType').append(html);
                        });
                    })

                    var getTpl2 = $('#Banner').html();
                    $.each(data.data.BannerList, function (i, r) {
                        r.Index = i + 1;
                        laytpl(getTpl2).render(r, function (html) {
                            $('#BannerList').append(html);
                        });
                    })
                    //banner焦点图开始
                    var swiper = new Swiper('.swiper-container', {
                        pagination: '.swiper-pagination',
                        nextButton: '.swiper-button-next',
                        prevButton: '.swiper-button-prev',
                        slidesPerView: 1,
                        paginationClickable: true,
                        spaceBetween: 30,
                        loop: true,
                        autoplay: 3000,
                    });
                    var swiper = new Swiper('.swiper-container1', {
                        nextButton: '.swiper-button-next',
                        prevButton: '.swiper-button-prev',
                        paginationClickable: true,
                        slidesPerView: 5,
                        spaceBetween: 13,
                        loop: true,
                        autoplay: 2000,

                    });
                    var swiper = new Swiper('.swiper-container2', {
                        nextButton: '.swiper-button-next',
                        prevButton: '.swiper-button-prev',
                        paginationClickable: true,
                        slidesPerView: 4,
                        slidesPerColumn: 2,
                        spaceBetween: 13,
                        loop: true,
                        autoplay: 2000,

                    });
                    //banner焦点图结束
                    var getTpl3 = $('#Cooperation').html();
                    $.each(data.data.Cooperation, function (i, r) {
                        r.Index = i + 1;
                        laytpl(getTpl3).render(r, function (html) {
                            $('#CooperationList').append(html);
                        });
                    })
                    var getTpl4 = $('#system').html();
                    $.each(data.data.systmelist, function (i, r) {
                        r.Index = i + 1;
                        laytpl(getTpl4).render(r, function (html) {
                            $('#systemList').append(html);
                        });
                    })
                    $('#systemList').append("<p>版权所有@国玉艺术品交易</p>");
                }
            })

            $.post('/Home/HomeShowProduct', function (data) {
                if (data.success) {
                    var getTpl = $('#ProductTypeInfo').html();
                    $.each(data.data, function (i, r) {
                        r.Index = i + 1;
                        laytpl(getTpl).render(r, function (html) {
                            $('#productTypeListInfo').append(html);
                        });
                    })
                }
            });

        });
    </script>
    <script type="text/template" id="HomeType">
        <dl class="clearfix">
            <dt><a href="/Product/ProductSearch?TypeName={{d.Name}}&&TypeID={{d.ParamID}}">{{d.Name}}</a></dt>
            {{#  $.each(d.ChildList, function (i, r) {}}
                <dd><a href="/Product/ProductSearch?TypeName={{d.Name}}&TypeID={{d.ParamID}}&ChildTypeName={{r.Name}}&&ChildID={{r.ChildID}}">{{r.Name}}</a></dd>
            {{# })}}
        </dl>
    </script>
    <script type="text/template" id="crossType">
        <li><a href="/Product/ProductSearch?TypeName={{d.Name}}&&TypeID={{d.ParamID}}">{{d.Name}}</a></li>
    </script>
    <script type="text/template" id="Banner">
        <div class="swiper-slide" style="background: url({{d.Image}})no-repeat center center"></div>
    </script>
    <script type="text/template" id="Cooperation">
        <li><a target="_blank" href="{{d.BannerURL}}"><img width="170" height="70" src="{{d.Image}}"></a></li>
    </script>
    <script type="text/template" id="system">
        <span>{{d.SystemKey}}: {{d.SystemValue}}</span>
    </script>
    <script type="text/template" id="ProductTypeInfo">
        <section class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
            <div class="clearfix head_tit">
                <h1>{{d.Name}}</h1>
                <div class="fl">
                    <ul class="layui-tab-title">
                        {{#  $.each(d.ChildList, function (i, r) {}}
                            {{# if(i==0){}}
                                <li class="layui-this">{{r.Name}}</li>
                            {{# }else{ }}
                                <li>{{r.Name}}</li>
                            {{# } }}
                        {{# })}}
                    </ul>
                </div>
                <a href="/Product/ProductSearch?TypeName={{d.Name}}&&TypeID={{d.ParamID}}">查看更多</a>
            </div>
            <div class="layui-tab-content">
                {{#  $.each(d.ChildList, function (i, r) {}}
                {{# if(i==0){}}
               
                    <div class="layui-tab-item layui-show">
                        <ul class="clearfix indexBox">
                            {{#  $.each(r.ProductList, function (j, m) {}}
                            <li>
                                <a href="/Product/ProductInfo?ID={{m.ProductID}}">
                                    <img width="270" height="270" src="{{m.Image}}"><span>{{m.Title}}</span>
                                    <p> {{m.Money}}</p>
                                </a>
                            </li>
                            {{# })}}
                        </ul>
                    </div>
                
                {{# }else{ }}
                    <div class="layui-tab-item">
                        <ul class="clearfix indexBox">
                           {{#  $.each(r.ProductList, function (j, m) {}}
                            <li>
                                <a href="/Product/ProductInfo?ID={{m.ProductID}}">
                                    <img width="270" height="270" src="{{m.Image}}">
                                        <span>{{m.Title}}</span>
                                        <p>{{m.Money}}</p>
                                </a>
                            </li>
                            {{# })}}
                        </ul>
                    </div>
                {{# } }}
                {{# })}}
               
            </div>
        </section>
    </script>
</head>
<body>
    <header>
        <div class="headTop">
            <div class="container clearfix">
                <p class="fl">Hi~欢迎来到国玉艺术品交易!</p>
                <p class="fr"><a href="/Auto/AutoInfo?ID=1" style="padding-right:20px;">关于我们</a><a href="/Auto/AutoInfo?ID=2">联系我们</a></p>
            </div>
        </div>
        <div class="head container clearfix">
            <div class="fl logo">
                <h1><a href="/home/index" title="国玉艺术品交易">国玉艺术品交易</a></h1>
            </div>
            <div class="fl seach">
                <input class="seachBox" type="text" id="Search" placeholder="请输入藏品名称或关键词">
                <input class="seachBtn" type="button" value="" onclick="location = '/Product/ProductSearch?Search=' + $('#Search').val()">
            </div>
            <div class="fl head_r"><img src="/Content/PC/images/ewm.jpg"><img src="/Content/PC/images/ewm.jpg"></div>
        </div>
        <div class="nav">
            <div class="container clearfix">
                <div class="fl navBox">
                    <div class="navBox_a">
                        <a class="navBox_b" href="/Product/ProductSearch">商品分类</a>
                        <div class="navBox_c" style="display: block" id="ProductTypeList">
                            
                        </div>
                    </div>
                </div>
                <div class="fl navsub">
                    <ul class="clearfix crossProductType"></ul>
                </div>
            </div>
        </div>
    </header>
    <!--焦点图-->
    <section class="swiper-container">
        <div class="swiper-wrapper" id="BannerList">


        </div>
        <!--分页器 -->
        <div class="swiper-pagination"></div>
        <div class="swiper-button-next index_left"></div>
        <div class="swiper-button-prev index_right"></div>
    </section>
    <div class="container">
        <!--藏品会员展示区-->
        <section>
            <div class="clearfix head_tit">
                <h1>藏品会员展示区</h1>
                <a href="/Product/ProductList?TopProduct=1">查看更多</a>
            </div>
            <div class="swiper-container1">
                <div class="swiper-wrapper" style="width: 100%">
                    @{
                        if (ViewBag.TopProduct != null)
                        {
                            foreach (Gtkj.CMS.Model.ProductInfo item in ViewBag.TopProduct)
                            {
                                <div class="swiper-slide"><a href="/Product/ProductInfo?ID=@item.ProductID"><img width="270" height="270" src="@item.Image"><span>@item.Title</span><b> @(item.Money == 0 ? "询价" : item.Money.ToString())</b></a></div>
                            }

                        }
                    }
                </div>
                <!-- Add Pagination -->
                <div class="swiper-button-next"></div>
                <div class="swiper-button-prev"></div>
            </div>
        </section>
        <!--名家推广-->
        <section>
            <div class="clearfix head_tit">
                <h1>名家推广</h1>
            </div>
            <div class="swiper-container1 wc_index">
                <div class="swiper-wrapper" style="width: 100%">
                    @{
                        if (ViewBag.ExpertsList != null)
                        {
                            foreach (Gtkj.CMS.Model.Experts item in ViewBag.ExpertsList)
                            {
                                <div class="swiper-slide">
                                    <a href="/Auto/ExpertsInfo?ID=@item.ID">
                                        <img src="@item.Portrait" width="222" height="250">
                                        <div class="wc_indexT">
                                            <span>@item.Name</span>
                                            <p>@item.JobDescription</p>
                                        </div>
                                    </a>
                                </div>
                            }
                        }
                    }
                    
                </div>
                <!-- Add Pagination -->
                <div class="swiper-button-next"></div>
                <div class="swiper-button-prev"></div>
            </div>
        </section>
        <!--藏品加急出手区-->
        <section>
            <div class="clearfix head_tit">
                <h1>藏品加急出手区</h1>
            </div>
            <div class="clearfix">
                <div class="fl index1"><a href="javascript:"><img src="/Content/PC/images/g1.jpg"></a></div>
                <div class="fr index2">
                    <div class="swiper-container2">
                        <div class="swiper-wrapper">
                            @{
                                if (ViewBag.UrgentProduct!=null)
                                {
                                    foreach (Gtkj.CMS.Model.ProductInfo item in ViewBag.UrgentProduct)
                                    {
                                        <div class="swiper-slide"><a href="/Product/ProductInfo?ID=@item.ProductID"><img width="270" height="270" src="@item.Image"><span>@item.Title</span><b> @(item.Money == 0 ? "询价" : item.Money.ToString())</b></a></div>
                                    }

                                }
                            }
                        </div>
                        <!-- Add Pagination -->
                        <div class="swiper-button-next"></div>
                        <div class="swiper-button-prev"></div>
                    </div>
                </div>
            </div>
        </section>
        <section>
            <div class="clearfix head_tit">
                <h1>藏品成交区</h1>
                <a href="/Product/ProductList?ClinchProduct=1">查看更多</a>
            </div>
            <div class="swiper-container1">
                <div class="swiper-wrapper" style="width: 100%">
                    @{
                        if (ViewBag.ClinchProduct != null)
                        {
                            foreach (Gtkj.CMS.Model.ProductInfo item in ViewBag.ClinchProduct)
                            {
                                <div class="swiper-slide"><a href="/Product/ProductInfo?ID=@item.ProductID"><img width="270" height="270" src="@item.Image"><span>@item.Title</span><b>@(item.Money == 0 ? "询价" : item.Money.ToString())</b></a></div>
                            }

                        }
                    }
                </div>
                <!-- Add Pagination -->
                <div class="swiper-button-next"></div>
                <div class="swiper-button-prev"></div>
            </div>
        </section>
        <div id="productTypeListInfo">
        </div>
            <!--国玉成交区域展示区-->
            <section class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
                <div class="clearfix head_tit">
                    <h1>最新动态</h1>
                    <a href="/News/NewList">查看更多</a>
                </div>
                <ul class="clearfix index3">
                    @{
                        if (ViewBag.NewList != null)
                        {
                            foreach (Gtkj.CMS.Model.NewInfo item in ViewBag.NewList)
                            {
                                <li>
                                    <a href="/News/NewInfo?ID=@item.NewId" class="index31"><img width="340" height="220" src="@item.Image"></a> <a href="/News/NewInfo?ID=@item.NewId" class="index32">@item.Title</a>
                                    <p>@item.ShortTitle</p>
                                </li>
                            }

                        }
                    }
                   
                   
                </ul>
            </section>
       
        <!--战略合作伙伴-->
        <section class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
            <div class="clearfix head_tit">
                <h1>战略合作伙伴</h1>
            </div>
            <ul class="clearfix index4" id="CooperationList">
            </ul>
        </section>
    </div>
    <footer class="foot">
        <div class="footBox">
            <ul class="foot_u clearfix crossProductType">
               
            </ul>
            <div class="foot_b" id="systemList">
               
            </div>
        </div>
    </footer>
    
</body>
</html>
